
.article > .content * {
    // 这是为了让图片等不将父元素撑开
    max-width: 100%;
}

.editor-preview img {
    // 附带：编辑中的撑开修正
    width: auto;
    max-width: 100%;
}

.article > .content p {
    margin: 0;
    margin-bottom: .5em;
}

.article > .content, .editor-preview {
    min-height: 30vh;

    blockquote {
        color: $gray-500;
        position: relative;

        &::before, &::after {
            display: block;
            font-size: 35px;
            position: absolute;
            font-family: serif;
            color: $gray-500;
        }

        &::before {
            left: -35px;
            top: 0px;
            content: "“";
        }

        &::after {
            right: -35px;
            bottom: 0px;
            content: "”";
        }
    }

    .img-center {
        text-align: center;
    }

    font-weight: 400;
    color: $gray-700;
    // 标题大小调整
    line-height: 2em;
    h1, h2, h3, h4, h5, h6 { line-height: 2em; margin: .5em 0; width: 100%; }
    h1 { font-size: 24px; border-bottom: 1px solid #ddd; padding-bottom: 0em; margin-bottom: 1.5em }
    h2 { font-size: 22px; border-bottom: 1px solid #eee; padding-bottom: 0em; margin-bottom: 1em }
    h3 { font-size: 20px; }
    h4 { font-size: 18px; }
    h5 { font-size: 16px; }
    h6 { font-size: 14px; }
}

.cm-header {
    line-height: 1.5em;

    &.cm-header-1 { font-size: 24px !important; }
    &.cm-header-2 { font-size: 22px !important; }
    &.cm-header-3 { font-size: 20px !important; }
    &.cm-header-4 { font-size: 18px !important; }
    &.cm-header-5 { font-size: 16px !important; }
    &.cm-header-6 { font-size: 14px !important; }
}

.placeholder-text {
    display: inline-block;
    background-color: #e9e9e9;
    width: 100%;

    &.f12 { height: 12px; }
    &.f14 { height: 14px; }
    &.f16 { height: 16px; }
    &.f18 { height: 18px; }
}

.limit {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    &.inline { display: inline-block; }
    &.w2 { width: 3em; }
    &.w4 { width: 5em; }
    &.w6 { width: 7em; }
    &.w8 { width: 9em; }
    &.w12 { width: 13em; }

    &.l2 { min-width: 3em; }
    &.l4 { min-width: 5em; }
    &.l6 { min-width: 7em; }
    &.l8 { min-width: 9em; }
    &.l12 { min-width: 13em; }

    &.m2 { max-width: 3em; }
    &.m4 { max-width: 5em; }
    &.m6 { max-width: 7em; }
    &.m8 { max-width: 9em; }
    &.m12 { max-width: 13em; }
    &.m18 { max-width: 19em; }
}
